<template>
  <div>
    <el-dialog :title="title"
               :visible.sync="open"
               width="700px"
               append-to-body
               :close-on-click-modal="false">

      <el-form ref="form"
               :model="form"
               :rules="rules"
               size="small"
               label-width="150px">
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="计算机名：">
              <span>{{form.pcName}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="本机ip：">
              <span>{{form.ip}}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="本机登录名："
                          prop="loginName">
              <el-input v-model="form.loginName"
                        placeholder="请输入"
                        size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="本机登录密码："
                          prop="loginPassword">
              <el-input v-model="form.loginPassword"
                        type="password"
                        placeholder="请输入"
                        size="small">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="主控端ip："
                          prop="masterIp">
              <el-input v-model="form.masterIp"
                        placeholder="请输入"
                        size="small"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="备注：">
              <el-input type="textarea"
                        v-model="form.remark"
                        placeholder="请输入"
                        size="small"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer"
           class="dialog-footer">
        <el-button type="primary"
                   @click="submitForm">同 意</el-button>
        <el-button @click="cancel"
                   type="danger">驳 回</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data () {
    return {
      form: {
        pcName: '',
        ip: '',
        loginName: void 0,
        loginPassword: void 0,
        masterIp: void 0,
        remark: void 0
      },
      // 表单校验
      rules: {
        loginName: [
          { required: true, message: '请输入本机登录名', trigger: 'blur' },
        ],
        loginPassword: [
          { required: true, message: '请输入本机登录密码', trigger: 'blur' }
        ],
        masterIp: [
          { required: true, message: '请输入主控端ip', trigger: 'blur' }
        ],
      },
      // 弹窗控制
      open: false,
      // 弹窗标题
      title: '',
    }
  },
  methods: {
    // addOpen () {
    //   this.resetSoftware()
    //   this.open = true
    //   this.title = '新增模型软件'
    // },
    editOpen (row) {
      this.open = true
      this.title = `${row.pcName}-连接申请`
      this.form.pcName = row.pcName
      this.form.ip = row.ip
    },
    /** 提交按钮 */
    submitForm () {
      this.$refs['form'].validate(valid => {
        // if (valid) {
        //   if (this.form.softwareId !== undefined && this.form.softwareId !== null) {
        //     updateSoftware(this.form).then(response => {
        //       this.$modal.msgSuccess('修改成功')
        //       this.open = false
        //       this.$emit('ok')
        //     })
        //   } else {
        //     addSoftware(this.form).then(response => {
        //       this.$modal.msgSuccess('新增成功')
        //       this.resetForm('form')
        //       this.open = false
        //       this.$emit('ok')
        //     })
        //   }
        // }
      })
    },
    // 表单取消按钮
    cancel () {
      this.open = false
      this.resetSoftware()
      this.$emit('ok')
    },
    // 表单重置
    resetSoftware () {
      this.form = {
        softwareName: void 0,
        softwareDesc: void 0,
        softwareCreateTime: void 0,
        softwareCreater: void 0,
        softwareUrl: void 0,
        varScriptUrl: void 0,
        runScriptUrl: void 0
      }
      this.resetForm('form')
    },
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-scrollbar__wrap {
  overflow-x: hidden;
}
</style>